<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Multi Select</title>
<link href="style/style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="container">

    <div class="multiselect_area temporary-padding">
        <div class="multiselect" id="level-1">
        	<div class="select-title">Body Parts</div>
            <ul class="multiselect-checkboxes">
                <li>
                    <label for="multiselect-0-option-0">
                        <i class="icon-sort"></i>
                        <span>Option 1</span>
                        <i class="icon-trash"></i>
                        <i class="icon-edit"></i>
                    </label>
                </li>
                <li>
                    <label class="focused" for="multiselect-0-option-1">
                        <i class="icon-sort"></i>
                        <span>Option 2</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label for="multiselect-0-option-2">
                        <i class="icon-sort"></i>
                        <span>Option 3</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label for="multiselect-0-option-3">
                        <i class="icon-sort"></i>
                        <span>Option 4</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-0-option-4">
                        <i class="icon-sort"></i>
                        <span>Option 5</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-0-option-5">
                        <i class="icon-sort"></i>
                        <span>Option 6</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-0-option-6">
                        <i class="icon-sort"></i>
                        <span>Option 7</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-0-option-7">
                        <i class="icon-sort"></i>
                        <span>Option 8</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-0-option-8">
                        <i class="icon-sort"></i><span>Option 9</span>
                    <i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-0-option-9">
                        <i class="icon-sort"></i>
                        <span>Option 10</span>
                    <i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-0-option-10">
                        <i class="icon-sort"></i>
                        <span>Option 11</span>
                    <i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
            </ul>        
        </div>
        <div class="multiselect" id="level-2">
        	<div class="select-title">Part Areas</div>
        	<div class="multiselect-head">
            	<input type="text" name="add area" placeholder="add area" />
                <input type="button" value="add" />
            </div>
            <ul class="multiselect-checkboxes">
                <li>
                    <label for="multiselect-1-option-0">
                        <i class="icon-sort"></i><span>Option 1</span>
                    <i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label class="focused" for="multiselect-1-option-1">
                        <i class="icon-sort"></i>
                        <span>Option 2</span>
                    <i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label for="multiselect-1-option-2">
                        <i class="icon-sort"></i>
                        <span>Option 3</span>
                    <i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label for="multiselect-1-option-3">
                        <i class="icon-sort"></i>
                        <span>Option 4</span>
                    <i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-1-option-4">
                        <i class="icon-sort"></i>
                        <span>Option 5</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-1-option-5">
                        <i class="icon-sort"></i>
                        <span>Option 6</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-1-option-6">
                        <i class="icon-sort"></i>
                        <span>Option 7</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-1-option-7">
                        <i class="icon-sort"></i>
                        <span>Option 8</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-1-option-8">
                        <i class="icon-sort"></i>
                        <span>Option 9</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-1-option-9">
                        <i class="icon-sort"></i>
                        <span>Option 10</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-1-option-10">
                        <i class="icon-sort"></i>
                        <span>Option 11</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
            </ul>        
        </div>
        <div class="multiselect" id="level-3">
        	<div class="select-title">Symptoms</div>
        	<div class="multiselect-head">
            	<input type="text" name="add area" placeholder="add area" />
                <input type="button" value="add" />
            </div>
            <ul class="multiselect-checkboxes">
                <li>
                    <label for="multiselect-2-option-0">
                        <i class="icon-sort"></i>
                        <span>Option 1</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label class="focused" for="multiselect-2-option-1">
                        <i class="icon-sort"></i>
                        <span>Option 2</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label for="multiselect-2-option-2">
                        <i class="icon-sort"></i>
                        <span>Option 3</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label for="multiselect-2-option-3">
                        <i class="icon-sort"></i>
                        <span>Option 4</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-2-option-4">
                        <i class="icon-sort"></i>
                        <span>Option 5</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-2-option-5">
                        <i class="icon-sort"></i>
                        <span>Option 6</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-2-option-6">
                        <i class="icon-sort"></i>
                        <span>Option 7</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-2-option-7">
                        <i class="icon-sort"></i>
                        <span>Option 8</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-2-option-8">
                        <i class="icon-sort"></i>
                        <span>Option 9</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-2-option-9">
                        <i class="icon-sort"></i>
                        <span>Option 10</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-2-option-10">
                        <i class="icon-sort"></i>
                        <span>Option 11</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
            </ul>        
        </div>
        <div class="multiselect" id="level-2">
        	<div class="select-title">Report</div>
            <ul class="multiselect-checkboxes">
                <li>
                    <label for="multiselect-3-option-0">
                        <i class="icon-sort"></i>
                        <span>Option 1</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label class="focused" for="multiselect-3-option-1">
                        <i class="icon-sort"></i>
                        <span>Option 2</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label for="multiselect-3-option-2">
                        <i class="icon-sort"></i>
                        <span>Option 3</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
                </li>
                <li>
                    <label for="multiselect-3-option-3">
                        <i class="icon-sort"></i>
                        <span>Option 4</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-3-option-4">
                        <i class="icon-sort"></i>
                        <span>Option 5</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-3-option-5">
                        <i class="icon-sort"></i>
                        <span>Option 6</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-3-option-6">
                        <i class="icon-sort"></i>
                        <span>Option 7</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-3-option-7">
                        <i class="icon-sort"></i>
                        <span>Option 8</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-3-option-8">
                        <i class="icon-sort"></i>
                        <span>Option 9</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-3-option-9">
                        <i class="icon-sort"></i>
                        <span>Option 10</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
                <li>
                    <label for="multiselect-3-option-10">
                        <i class="icon-sort"></i>
                        <span>Option 11</span>
                    	<i class="icon-trash"></i>
                        <i class="icon-edit"></i></label>
               </li>
            </ul>        
        </div>
    </div>

</div>
</body>
</html>
